<!-- src/components/RightSidebar.vue -->
<template>
    <el-aside style="background-color: #f5f5f5; padding: 20px;">
      <div>
        <h3>晚上好！</h3>
        <el-button type="text" @click="signIn">去签到</el-button>
      </div>
      <div>
        <h3>文章榜</h3>
        <el-card v-for="article in topArticles" :key="article.id" class="top-article-card">
          <h4>{{ article.rank }}. {{ article.title }}</h4>
        </el-card>
      </div>
      <div>
        <h3>作者榜</h3>
        <el-card v-for="author in topAuthors" :key="author.id" class="top-author-card">
          <h4>{{ author.rank }}. {{ author.name }}</h4>
        </el-card>
      </div>
    </el-aside>
  </template>
  
  <script>
  export default {
    data() {
      return {
        topArticles: [
          { id: 1, rank: 1, title: 'MarsCode 编程助手模型升级至豆包大模型1.5，同时支持切换满血版...' },
          { id: 2, rank: 2, title: '上午系统崩溃，下午就喜提大...' },
          // 更多文章...
        ],
        topAuthors: [
          { id: 1, rank: 1, name: 'Y11_推特同名' },
          { id: 2, rank: 2, name: 'ys指风不买醉' },
          // 更多作者...
        ],
      };
    },
    methods: {
      signIn() {
        alert('签到成功');
      },
    },
  };
  </script>
  
  <style scoped>
  .top-article-card,
  .top-author-card {
    margin-bottom: 10px;
  }
  </style>